import { connect } from 'react-redux';
// 导入视图组件
import Counter from '../components/Counter';
// 导入action(更新规则)
import { increment, decrement } from '../redux/actions';

// 调用connect方法连接视图组件和容器组件
// (其实是将容器组件中的数据传递给视图组件, 最终返回一个最终的组件)
// 相当于对Counter组件的状态进行了初始化(使用)

// 简洁写法
// export default connect(
//         (state)=>{return {count:state.count,user:state.user}},  // 状态属性
//         {increment,decrement}             // 状态方法
// )(Counter);



// 容易理解的写法

/*
mapStateToProps最终结果(state需要有connect来自动注入):{count:state.count,user:state.user}      
*/
const mapStateToProps = function (state) {
        return { count: state.count, user: state.user }
}
/*
mapDispatchToProps最终结果:
*/
const mapDispatchToProps = function (dispatch) {
        return {
                increment: function(number){
                        //执行结果: {type:INCREMENT,data:number}
                        const act=increment(number);
                        dispatch(act)
                },
                decrement:function(number){
                        // 执行结果:{type:INCREMENT,data:number}
                        const act=decrement(number);
                        dispatch(act)
                }
                
        }
}

//(number) => dispatch(increment(number))
// decrement: (number) => dispatch(decrement(number))
export default connect(
        mapStateToProps,
        mapDispatchToProps
)(Counter)